<!DOCTYPE html>

<html lang="en">
<head>
    <title>实况8</title>
    <link rel="icon" type="image/png" href="/img/worldcup.png">
    <meta charset="UTF-8" />
    <link rel="stylesheet" href="/css/bootstrap.css"/>
</head>
<body>
    <#if msg??>
        <div class="container-fluid" style="text-align: center">
            <h1>${msg}(${syCountryList?size})</h1>
        </div>
    </#if>
    <#if sk8Type??>
        <div class="container-fluid" style="text-align: center">
            <h1>${sk8Type.value}(${syCountryList?size})</h1>
        </div>
    </#if>
    <div class="container-fluid">
        <a href="${request.contextPath}/country/sk8_list">全部</a> &nbsp;&nbsp;&nbsp;&nbsp;
        <a href="${request.contextPath}/country/sk8_list?sk8type=ASIA">亚洲</a> &nbsp;&nbsp;&nbsp;&nbsp;
        <a href="${request.contextPath}/country/sk8_list?sk8type=EUROPE">欧洲</a> &nbsp;&nbsp;&nbsp;&nbsp;
        <a href="${request.contextPath}/country/sk8_list?sk8type=AFRICA">非洲</a> &nbsp;&nbsp;&nbsp;&nbsp;
        <a href="${request.contextPath}/country/sk8_list?sk8type=AMERICA">美洲</a>
    </div>
    <div class="container-fluid">
        <div class="table-responsive">
            <table id="dataGrid" class="table table-striped table-bordered">
                <thead>
                <tr>
                    <th style="background-color: #ffda6a;">实况8排名</th>
                    <th>实况8积分</th>
                    <th>国家国旗</th>
                    <th>国家名称</th>
                    <th>实况8类型</th>
                    <th>冠军次数</th>
                    <th>亚军次数</th>
                    <th>季军次数</th>
                    <th>殿军次数</th>
                    <th>八强次数</th>
                    <th>十六强次数</th>
                    <th>小组赛次数</th>
                </tr>
                </thead>
                <tbody>
                <#list syCountryList as syCountry>
                    <tr>
                        <td style="background-color: #ffda6a;">${syCountry.sk8Rank}</td>
                        <td>${syCountry.sk8Intergral}</td>
                        <td>
                            <img src="/flag/${syCountry.continentType}/${syCountry.enName}_${syCountry.cnName}.png"
                                 width="60px" height="40px" />
                            <#if (syCountry.sk8OneCnt >0) >
                                <#list 1..syCountry.sk8OneCnt as cnt>
                                    <img src="/img/star.png" width="20px" height="20px" />
                                </#list>
                            </#if>
                        </td>
                        <td
                            <#if syCountry.sk8Type == 'ASIA'>style="background-color: lightcoral;"</#if>
                            <#if syCountry.sk8Type == 'AFRICA'>style="background-color: lightgreen;"</#if>
                            <#if syCountry.sk8Type == 'AMERICA'>style="background-color: lightskyblue;"</#if>
                            <#if syCountry.sk8Type == 'EUROPE'>style="background-color: lightgoldenrodyellow;"</#if>
                        >
                            ${syCountry.cnName}(${syCountry.code})
                            </br>
                            ${syCountry.enName}
                        </td>
                        <td>
                            <#if syCountry.sk8Type??>
                                ${syCountry.sk8Type.value}
                            </#if>
                        </td>
                        <td>${syCountry.sk8OneCnt}</td>
                        <td>${syCountry.sk8TwoCnt}</td>
                        <td>${syCountry.sk8ThreeCnt}</td>
                        <td>${syCountry.sk8FourCnt}</td>
                        <td>${syCountry.sk8EightCnt}</td>
                        <td>${syCountry.sk8SixteenCnt}</td>
                        <td>${syCountry.sk8WcgroupCnt}</td>
                    </tr>
                </#list>
                </tbody>
            </table>
        </div>
    </div>
</body>
</html>